<template><!--个人档案-->
    <div style="height: 100%">
        <navbar :title="$t('personal_files')"></navbar>
        <div class="content-noBottom" v-if="isMeInd == true">
            <div class="paddingLR15 white-bg margin-bottom10 bottom-shadow clearfix" style="height: 70px;line-height: 70px;" @click="chooseAvatar()">
                <span class="font-size14">{{ $t('personal_files_avatar') }}</span><!--头像-->
                <i class="arrow-right" style="margin-top: 30px;"></i>
                <span style="float: right;" class="user-pic-4"><img :src="appUrl + user.userPoto" alt=""/></span>
                <input type="file" style="visibility: hidden;" accept="image/*" ref="file" @change="onUpFile"/>
            </div>
            <ul class="module-list-12 bottom-shadow margin-bottom10">

                <li class="clearfix">
                    <span class="list-left">{{ $t('personal_files_fullName') }}</span><!--全名-->
                    <div class="list-right paddingR2">
                        <span>{{ user.usrDisplayBil }}</span>
                    </div>
                </li>
                <li class="clearfix">
                    <span class="list-left">{{ $t('personal_files_nick_name') }}</span><!--昵称-->
                    <div class="list-right paddingR2">
                        <span>{{ user.usrNickname }}</span>
                    </div>
                </li>
                <li class="clearfix" @click="editInformation('editTitleName')">
                    <span class="list-left">{{ $t('personal_files_headTitle_Name') }}</span><!--头衔-->
                    <div class="list-right paddingR2">
                        <i class="arrow-right"></i>
                        <span style="display: flex;justify-content: flex-end;align-items: center;" v-show="myTitle.headTitleIcon && myTitle.headTitleName">
                            <span><img :src="appUrl + myTitle.headTitleIcon" width="20px" height="20px"></span>
                            <span>{{ myTitle.headTitleName }}</span>
                        </span>
                    </div>
                </li>
                <li class="clearfix">
                    <span class="list-left">{{ $t('personal_files_birthday') }}</span><!--生日-->
                    <div class="list-right paddingR2">
                        <span v-if="user.usrBday">{{ (user.usrBday).split(' ')[0] }}</span>
                    </div>
                </li>
            </ul>
            <ul class="module-list-12 bottom-shadow margin-bottom10">
                <li class="clearfix">
                    <span class="list-left">{{ $t('personal_files_email') }}</span><!--电子邮件-->
                    <div class="list-right paddingR2">
                        <span>{{ user.usrEmail }}</span>
                    </div>
                </li>
            </ul>
            <ul class="module-list-12 bottom-shadow margin-bottom10">
                <li class="clearfix">
                    <span class="list-left">{{ $t('personal_files_usr_group') }}</span><!--用户组-->
                    <div class="list-right">
                        <span>{{ user.usgDisplayBil }}</span>
                    </div>
                </li>
                <li class="clearfix">
                    <span class="list-left">{{ $t('cos_recommend_grade_select') }}</span><!--职级-->
                    <div class="list-right">
                        <span>{{ user.userGrade ? user.userGrade.ugrDisplayBil : ''}}</span>
                    </div>
                </li>
            </ul>
            <ul class="module-list-12 bottom-shadow margin-bottom10">
                <li class="clearfix" @click="editInformation('editSelfDescription')">
                    <div>
                        <span class="list-left">{{ $t('personal_files_description') }}</span><!--个人描述-->
                        <i class="arrow-right" style="margin-right: 0;"></i>
                    </div>
                    <div class="font-size14 color999" style="padding-top: 20px;" v-if="user && user.urxExtra44">{{ user.urxExtra44 }}</div>
                </li>
                <li class="clearfix" @click="editInformation('editInterest')">
                    <div>
                        <span class="list-left">{{ $t('personal_files_interest') }}</span><!--兴趣-->
                        <i class="arrow-right" style="margin-right: 0;"></i>
                    </div>
                    <div class="font-size14 color999" style="padding-top: 20px;" v-if="user && user.urxExtra45">{{ user.urxExtra45 }}</div>
                </li>
            </ul>
        </div>
        <div class="content-noBottom" v-if="isMeInd == false">
            <div class="paddingLR15 white-bg margin-bottom10 bottom-shadow clearfix" style="height: 70px;line-height: 70px;">
                <span class="font-size14">{{ $t('personal_files_avatar') }}</span><!--头像-->
                <span style="float: right;" class="user-pic-4"><img :src="appUrl + user.userPoto" alt=""/></span>
            </div>
            <ul class="module-list-12 bottom-shadow margin-bottom10">
                <li class="clearfix">
                    <span class="list-left">{{ $t('personal_files_fullName') }}</span><!--全名-->
                    <div class="list-right">
                        <span>{{ user.usrDisplayBil }}</span>
                    </div>
                </li>
                <li class="clearfix">
                    <span class="list-left">{{ $t('personal_files_nick_name') }}</span><!--昵称-->
                    <div class="list-right">
                        <span>{{ user.usrNickname }}</span>
                    </div>
                </li>
                <li class="clearfix" v-if="user.usrBday">
                    <span class="list-left">{{ $t('personal_files_birthday') }}</span><!--生日-->
                    <div class="list-right">
                        <span v-if="user.usrBday">{{ (user.usrBday).split(' ')[0] }}</span>
                    </div>
                </li>
            </ul>
            <ul class="module-list-12 bottom-shadow margin-bottom10">
                <li class="clearfix" v-if="user.usrEmail">
                    <span class="list-left">{{ $t('personal_files_email') }}</span><!--电子邮件-->
                    <div class="list-right">
                        <span>{{ user.usrEmail }}</span>
                    </div>
                </li>
            </ul>
            <ul class="module-list-12 bottom-shadow margin-bottom10">
                <li class="clearfix" v-if="user.usgDisplayBil">
                    <span class="list-left">{{ $t('personal_files_usr_group') }}</span><!--用户组-->
                    <div class="list-right">
                        <span>{{ user.usgDisplayBil }}</span>
                    </div>
                </li>
                <li class="clearfix" v-if="user.userGrade && user.userGrade.ugrDisplayBil !== 'Unspecified'">
                    <span class="list-left">{{ $t('cos_recommend_grade_select') }}</span><!--职级-->
                    <div class="list-right">
                        <span>{{ user.userGrade ? user.userGrade.ugrDisplayBil : '' }}</span>
                    </div>
                </li>
            </ul>
            <ul class="module-list-12 bottom-shadow margin-bottom10">
                <li class="clearfix" v-if="user && user.urxExtra44">
                    <div>
                        <span class="list-left">{{ $t('personal_files_description') }}</span><!--个人描述-->
                    </div>
                    <div class="font-size14 color999" style="padding-top: 20px;" v-if="user">{{ user.urxExtra44 }}</div>
                </li>
                <li class="clearfix" v-if="user && user.urxExtra45">
                    <div>
                        <span class="list-left">{{ $t('personal_files_interest') }}</span><!--兴趣-->
                    </div>
                    <div class="font-size14 color999" style="padding-top: 20px;" v-if="user && user.urxExtra45">{{ user.urxExtra45 }}</div>
                </li>
            </ul>
        </div>
        <div class="selectPopup" v-if="headPortrait">
            <div class="selectPopup-body">
                <div class="close-box clearfix" @click="headPortrait = false"><i class="close-icon-02"></i></div>
                <p style="margin-bottom: 20px;font-size: 18px;">{{ $t('personal_files_avatar') }}</p><!--头像-->
                <p @click="cameraIamge()">{{ $t('personal_files_app_camera') }}</p><!--照相-->
                <p @click="galleryIamge()">{{ $t('personal_files_app_gallery') }}</p><!--从相册中选择-->
            </div>
        </div>
        <div class="selectPopup" v-if="gender">
            <div class="selectPopup-body">
                <div class="close-box clearfix" @click="gender = false"><i class="close-icon-02"></i></div>
                <p style="margin-bottom: 20px;font-size: 18px;">{{ $t('personal_files_sex') }}</p><!--性别-->
                <p :class="{'cur' : user.usr_gender === ' '}" @click="selectSex(' ')">{{ $t('mod_files_null') }}</p><!--未指定-->
                <p :class="{'cur' : user.usr_gender === 'M'}" @click="selectSex('M')">{{ $t('personal_files_sex_M') }}</p><!--男-->
                <p :class="{'cur' : user.usr_gender === 'F'}" @click="selectSex('F')">{{ $t('personal_files_sex_F') }}</p><!--女-->
            </div>
        </div>
        <!--选择日期-->
        <div class="selectPopup" v-if="showPopup">
            <div class="selectPopup-body">
                <div class="close-box clearfix">{{ $t('personal_files_selectDate') }}</div><!--选择日期-->
                <datetime-view start-date="1940-01-01" v-model="dateValue" class="datetime-popup"></datetime-view>
                <div class="clearfix">
                    <span class="word-btn-04" style="float:right;" @click="saveDate(dateValue, saveType)">{{ $t('save') }}</span><!--保存-->
                    <span class="word-btn-04" style="float:right;" @click="showPopup = false">{{ $t('cancel') }}</span><!--取消-->
                </div>
            </div>
        </div>
        <!--编辑信息-->
        <div class="layer-box" v-if="editPopup">
            <div class="layer-header-box white-bg">
                <span class="icon-back-layer" @click="closeEditPopup()"></span>
                {{ $t(editTitleNameBox ? 'personal_files_edit_headTitle' : 'personal_files_edit_info') }}
                <span class="font-size15 write-btn-right" v-if="!editTitleNameBox && ((copyFullName == user.usrDisplayBil || errors.has('tipsFullName') == true || user.usrDisplayBil.replace(/(^\s*)|(\s*$)/g, '') === '') && (copyNickName == user.usrNickname || errors.has('tipsNickName') == true) && (copyEmail == user.usrEmail || errors.has('tipsEmail') == true || (copyEmail == user.usrEmail && user.usrEmail === '')) && (copyPhone == user.usr_tel_1 || errors.has('tipsPhone') == true) && (copyFax == user.usr_fax_1 || errors.has('tipsFax') == true) && (copyQQ == user.userExt.urx_extra_41 || errors.has('tipsQQ') == true) && (copyWechat == user.userExt.urx_extra_42 || errors.has('tipsWechat') == true) && (copyPosition == user.usr_job_title || errors.has('tipsPosition') == true) && (copySelfDescription == user.urxExtra44 || errors.has('tipsSelfDescription') == true) && (copyInterest == user.urxExtra45 || errors.has('tipsInterest') == true))">{{ $t('save') }}</span><!--保存-->
                <span style="position:absolute;right:10px;color:#333" class="font-size15 write-btn-right cur"  @click="saveText()" v-if="!editTitleNameBox && ((copyFullName !== user.usrDisplayBil && errors.has('tipsFullName') == false && user.usrDisplayBil.replace(/(^\s*)|(\s*$)/g, '') != '') || (copyNickName !== user.usrNickname && errors.has('tipsNickName') == false) || (copyEmail !== user.usrEmail && errors.has('tipsEmail') == false) || (copyEmail !== user.usrEmail && user.usrEmail === '') || (copyPhone !== user.usr_tel_1 && errors.has('tipsPhone') == false) || (copyFax !== user.usr_fax_1 && errors.has('tipsFax') == false) || (copyQQ !== user.userExt.urx_extra_41 && errors.has('tipsQQ') == false) || (copyWechat !== user.userExt.urx_extra_42 && errors.has('tipsWechat') == false) || (copyPosition !== user.usr_job_title && errors.has('tipsPosition') == false) || (copySelfDescription !== user.urxExtra44 && errors.has('tipsSelfDescription') == false) || (copyInterest !== user.urxExtra45 && errors.has('tipsInterest') == false))">{{ $t('save') }}</span>
            </div>
            <div class="add-contents-box" v-if="editTitleNameBox">
                <p class="word-title-06">{{ $t('personal_files_headTitle_myTitle') }}</p><!--头衔(查看)-->
                <div class="white-bg" style="padding: 5px 15px 10px;display: flex;">
                    <div v-if="myTitle.headTitleIcon && myTitle.headTitleName" style="text-align: center;">
                        <div>
                            <img :src="appUrl + myTitle.headTitleIcon" width="50px" height="50px">
                        </div>
                        <div>
                            {{ myTitle.headTitleName }}
                        </div>
                    </div>
                    <div v-else style="text-align: center;width: 100%;">
                        {{ $t('personal_files_headTitle_my_not_list') }}
                    </div>
                </div>
                <p class="word-title-06">{{ $t('personal_files_headTitle_list') }}</p>
                <div class="white-bg" style="padding: 5px 15px 10px;display: flex;flex-wrap: wrap;">
                    <div style="text-align: center;margin-right: 10px" v-for="item in titleRules" :key="item.head_title_id">
                        <div>
                            <img :src="appUrl + item.headTitleIcon" width="50px" height="50px">
                        </div>
                        <div style="color: #ccc">
                            {{ item.headTitleIntegral }} {{ $t('personal_files_headTitle_integral') }}
                        </div>
                        <div>
                            {{ item.headTitleName }}
                        </div>
                    </div>
                </div>
            </div>
            <div class="add-contents-box" v-if="editFullNameBox">
                <p class="word-title-06">{{ $t('personal_files_fullName') }}{{ $t('lab_required') }}</p><!--全名(必填)-->
                <div class="white-bg">
                    <textarea name="tipsFullName" :placeholder="$t('personal_files_fullName_tips')" style="height: 42px;" v-validate="'tipsFullName'" v-model="user.usrDisplayBil"></textarea><!--请输入全名...-->
                    <p class="font-size11 colorfd3 warning-red-tan warning" v-if="errors.has('tipsFullName')">{{ $t('exceeded_word_range_tips', {'value': '40'}) }}</p><!--40-->
                </div>
            </div>
            <div class="add-contents-box" v-if="editNickNameBox">
                <p class="word-title-06">{{ $t('personal_files_nick_name') }}</p><!--昵称-->
                <div class="white-bg">
                    <textarea name="tipsNickName" :placeholder="$t('personal_files_nick_name_tips')" style="height: 42px;" v-model="user.usrNickname" v-validate="'tipsNickName'"></textarea>
                    <p class="font-size11 colorfd3 warning-red-tan warning" v-if="errors.has('tipsNickName')">{{ $t('exceeded_word_range_tips', {'value': '40'}) }}</p><!--40-->
                </div>
            </div>
            <div class="add-contents-box" v-if="editEmailBox">
                <p class="word-title-06">{{ $t('personal_files_email') }}</p><!--电子邮件-->
                <div class="white-bg">
                    <textarea name="tipsEmail" :placeholder="$t('personal_files_email_tips')" style="height: 42px;" v-model="user.usrEmail" v-validate="'tipsEmail'"></textarea>
                    <p class="font-size11 colorfd3 warning-red-tan warning" v-if="errors.has('tipsEmail')">{{ $t('personal_files_email_tips_2') }}</p><!--格式错误，请输入有效电子邮件-->
                </div>
            </div>
            <div class="add-contents-box" v-if="editPhoneBox">
                <p class="word-title-06">{{ $t('personal_files_phone') }}</p><!--电话-->
                <div class="white-bg">
                    <textarea name="tipsPhone" :placeholder="$t('personal_files_phone_tips_1')" style="height: 42px;" v-model="user.usr_tel_1" v-validate="'tipsPhone'"></textarea>
                    <p class="font-size11 colorfd3 warning-red-tan warning" v-if="errors.has('tipsPhone')">{{ $t('personal_files_phone_tips_2') }}</p><!--格式错误，请输入11位数字的电话-->
                </div>
            </div>
            <div class="add-contents-box" v-if="editFaxBox">
                <p class="word-title-06">{{ $t('personal_files_fax') }}</p><!--传真-->
                <div class="white-bg">
                    <textarea name="tipsFax" :placeholder="$t('personal_files_fax_tips')" style="height: 42px;" v-model="user.usr_fax_1" v-validate="'tipsFax'"></textarea>
                    <p class="font-size11 colorfd3 warning-red-tan warning" v-if="errors.has('tipsFax')">{{ $t('exceeded_word_range_tips', {'value': '40'}) }}</p><!--40-->
                </div>
            </div>
            <div class="add-contents-box" v-if="editQQBox">
                <p class="word-title-06">{{ $t('personal_files_qq') }}</p><!--QQ-->
                <div class="white-bg">
                    <textarea name="tipsQQ" :placeholder="$t('personal_files_qq_tips')" style="height: 42px;" v-model="user.userExt.urx_extra_41" v-validate="'tipsQQ'"></textarea>
                    <p class="font-size11 colorfd3 warning-red-tan warning" v-if="errors.has('tipsQQ')">{{ $t('exceeded_word_range_tips', {'value': '40'}) }}</p><!--40-->
                </div>
            </div>
            <div class="add-contents-box" v-if="editWechatBox">
                <p class="word-title-06">{{ $t('personal_files_weixin') }}</p><!--微信-->
                <div class="white-bg">
                    <textarea name="tipsWechat" :placeholder="$t('personal_files_weixin_tips')" style="height: 42px;" v-model="user.userExt.urx_extra_42" v-validate="'tipsWechat'"></textarea>
                    <p class="font-size11 colorfd3 warning-red-tan warning" v-if="errors.has('tipsWechat')">{{ $t('exceeded_word_range_tips', {'value': '40'}) }}</p><!--40-->
                </div>
            </div>
            <div class="add-contents-box" v-if="editPositionBox">
                <p class="word-title-06">{{ $t('personal_files_job_title') }}</p><!--职称-->
                <div class="white-bg">
                    <textarea name="tipsPosition" :placeholder="$t('personal_files_job_title_tips')" style="height: 42px;" v-model="user.usr_job_title" v-validate="'tipsPosition'"></textarea>
                    <p class="font-size11 colorfd3 warning-red-tan warning" v-if="errors.has('tipsPosition')">{{ $t('exceeded_word_range_tips', {'value': '40'}) }}</p><!--40-->
                </div>
            </div>
            <div class="add-contents-box" v-if="editSelfDescriptionBox">
                <p class="word-title-06">{{ $t('personal_files_description') }}</p><!--个人描述-->
                <div class="white-bg">
                    <textarea name="tipsSelfDescription" :placeholder="$t('personal_files_description_tips')" v-model="user.urxExtra44" v-validate="'tipsSelfDescription'"></textarea>
                    <p class="font-size11 colorfd3 warning-red-tan warning" v-if="errors.has('tipsSelfDescription')">{{ $t('exceeded_word_range_tips', {'value': '200'}) }}</p><!--200-->
                </div>
            </div>
            <div class="add-contents-box" v-if="editInterestBox">
                <p class="word-title-06">{{ $t('personal_files_interest') }}</p><!--兴趣-->
                <div class="white-bg">
                    <textarea name="tipsInterest" :placeholder="$t('personal_files_interest_tips')" v-model="user.urxExtra45" v-validate="'tipsInterest'"></textarea>
                    <p class="font-size11 colorfd3 warning-red-tan warning" v-if="errors.has('tipsInterest')">{{ $t('exceeded_word_range_tips', {'value': '200'}) }}</p><!--200-->
                </div>
            </div>
            <!--确定退出？-->
            <van-dialog
                v-model="leaveHint"
                show-cancel-button
                :title="$t('confirm_exit_1')"
                :message="$t('confirm_exit_content_1')"
                :confirmButtonText="$t('sure')"
                :cancelButtonText="$t('cancel')"
                @confirm="editPopup = false"
                >
            </van-dialog>
            <div class="saving-box" v-if="savingShowBox == true">
                <p>
                    <van-loading type="spinner" size="24" />
                </p>
                <p>{{ $t('saveing') }}</p><!--保存中...-->
            </div>
        </div>
        <van-dialog
            v-model="confirmChooseTime"
            :title="chooseMsg"
            :confirmButtonText="$t('sure')"
            >
        </van-dialog>
        <div class="saving-box" v-if="uploadingShowBox == true">
            <p>
                <van-loading type="spinner" size="24" />
            </p>
            <p>{{ $t('uploading') }}...</p><!--上传中...-->
        </div>
    </div>
</template>

<script>
import {cwnEncrypt, cwnDecrypt} from '@/utils/tools';
export default {
    name: 'PersonalFile',
    data() {
        return {
            user: {},
            encId: '', //获取用户id
            loginUserIdwb: '', //登录用户id
            loginUserId: '',
            isMeInd: false, //用户id和登录用户id不一致
            mySupervise: [], //直属上司
            headPortrait: false, //头像
            gender: false, //性别
            editPopup: false,
            editTitleNameBox: false, //头衔
            editFullNameBox: false, //全名
            editNickNameBox: false, //昵称
            editEmailBox: false, //电子邮件
            editPhoneBox: false, //电话
            editFaxBox: false, //传真
            editQQBox: false, //QQ
            editWechatBox: false, //微信
            editPositionBox: false, //职称
            editSelfDescriptionBox: false, //个人描述
            editInterestBox: false, //兴趣
            copyFullName: '',
            copyNickName: '',
            copyEmail: '',
            copyPhone: '',
            copyFax: '',
            copyQQ: '',
            copyWechat: '',
            copyPosition: '',
            copySelfDescription: '',
            copyInterest: '',
            showPopup: false,
            dateValue: '',
            saveType: '',
            leaveHint: false, //退出不保存弹出层
            savingShowBox: false, //保存中弹出层
            confirmChooseTime: false, //日期超出当天时间
            chooseMsg: '',
            uploadingShowBox: false,
            saveImageFlag: false,
            myTitle: {}, //已有头衔
            titleRules: [] //头衔列表
        };
    },
    methods: {
        ...{cwnEncrypt, cwnDecrypt},
        /**
         * 获取头衔数据
         */
        getHeadTitleData() {
            //获取已有头衔
            this.$axios.get(`/app/head-title/user/${this.user.usrEntId}`).then(res => {
                if (res && res.data) {
                    this.myTitle = res.data;
                }
            });
            //获取头衔列表
            this.$axios.get(`/app/head-title/list`).then(res => {
                this.titleRules = res.data;
            });
        },
        /*保存*/
        savaUrl() {
            this.$validator.validate().then(res => {
                if (res) {
                    // debugger;
                    let param = new FormData();
                    param.append('file', this.user.userPhoto);
                    this.$axios({
                        method: 'POST',
                        url: `/app/api/file`,
                        headers: {'Content-Type': 'multipart/form-data'},
                        data: param
                    }).then(res => {
                        this.user.userPoto = res.data.url;

                        this.$axios({
                            method: 'POST',
                            url: `/app/api/trainee/my/user`,
                            data: {
                                image: this.user.userPoto,
                                interest: this.user.urxExtra45,
                                profile: this.user.urxExtra44
                            }
                        }).then(res => {
                            this.saveImageFlag = true;
                            setTimeout(() => {
                                this.user = {};
                                this.getUserInfo();
                                this.uploadingShowBox = false;
                            }, 100);
                        });
                    });
                }
            });
        },
        getUserInfo() {
            this.$axios({
                method: 'GET',
                url: `/app/api/trainee/my/detail`
            }).then(res => {
                this.user = res.data;
                this.getHeadTitleData();
            });
        },
        chooseAvatar() {
            // if (this.$store.state.config.plus) {
            //     this.headPortrait = true;
            // } else {
            //     this.$refs['file'].click();
            // }
            this.$refs['file'].click();
        },
        /*不是App打开图片文件*/
        onUpFile(e) {
            this.uploadingShowBox = true;
            let file = e.target.files[0];
            if (!file || ['jpg', 'gif', 'jpeg', 'png'].indexOf(e.target.files[0].type.split('/')[1]) === -1) {
                // 文件格式不对
                this.$toast(this.$t('lab_file_tips_13'));
                this.$refs.file.value = '';
                return;
            }
            this.user.userPhoto = file;
            this.savaUrl();
        },
        /*照相*/
        cameraIamge() {
            this.$store.state.config.plus.camera.getCamera().captureImage((p) => {
                this.user.userPhoto = p;
                this.appUpFile();
            });
        },
        /*相册*/
        galleryIamge() {
            this.$store.state.config.plus.gallery.pick((path) => {
                this.user.userPhoto = path;
                this.appUpFile();
            });
        },
        /*使用默认图片*/
        defaultImage() {
            this.$axios({
                method: 'POST',
                url: '/app/personal/personalDetail/update/useDefaultHeadImage',
                uploadType: 'ajax'
            }).then(res => {
                if (res.data.code === 200) {
                    this.getUserInfo();
                } else {
                    window.plus.nativeUI.alert(this.$t('lab_system_tips_1')); //服务器遇到错误，无法完成请求。
                }
                this.headPortrait = false;
            });
        },
        appUpFile() {
            this.uploadingShowBox = true;
            this.headPortrait = false;
            // this.savaUrl();
            let task = this.$store.state.config.plus.uploader.createUpload(this.appUrl + '/app/api/file', {}, (t, status) => {
                if (status === 200) {
                    // this.getUserInfo();

                }
                this.uploadingShowBox = false;
            });
            task.addFile(this.user.userPoto, {key: 'file'});
            // task.addData('joinTime', this.user.usr_join_datetime ? this.user.usr_join_datetime : '');
            // task.addData('birthday', this.user.usr_bday ? this.user.usr_bday : '');
            // task.addData('json', JSON.stringify(this.user));
            task.start();
        },
        /*性别弹出层*/
        chooseGender() {
            this.gender = true;
        },
        /*时间弹出层*/
        chooseTime(time, type) {
            if (time) {
                this.dateValue = time.split(' ')[0];
            } else {
                var myDate = new Date();
                var yearValue = myDate.getFullYear();
                var monthValue = myDate.getMonth() + 1;
                var dayValue = myDate.getDate();
                this.dateValue = yearValue + '-' + monthValue + '-' + dayValue;
            }
            if (type === 'birthday') {
                this.saveType = 'birthday';
            } else {
                this.saveType = 'joinTime';
            }
            this.showPopup = true;
        },
        saveDate(time, saveType) {
            var myDate = new Date().getTime();
            var chooseTime = new Date(time).getTime();
            if (chooseTime > myDate) {
                this.confirmChooseTime = true;
                if (saveType === 'birthday') {
                    this.chooseMsg = this.$t('personal_files_selectDate_tips'); //选择日期不能超过当前日期，请输入有效的出生日期
                } else {
                    this.chooseMsg = this.$t('personal_files_join_date_tips'); //选择日期不能超过当前日期，请输入有效的入职日期
                }
            } else {
                if (saveType === 'birthday') {
                    this.user.usr_bday = time;
                } else {
                    this.user.usr_join_datetime = time;
                }
                this.savaUrl();
                this.showPopup = false;
            }
        },
        /*编辑弹出层*/
        editInformation(chooseType) {
            this.editPopup = true;
            if (this.user.usrDisplayBil) {
                this.copyFullName = JSON.parse(JSON.stringify(this.user.usrDisplayBil));
            } else {
                this.copyFullName = '';
            }
            if (this.user.usrNickname) {
                this.copyNickName = JSON.parse(JSON.stringify(this.user.usrNickname));
            } else {
                this.copyNickName = '';
            }
            if (this.user.usrEmail) {
                this.copyEmail = JSON.parse(JSON.stringify(this.user.usrEmail));
            } else {
                this.copyEmail = '';
            }
            if (this.user.usr_tel_1) {
                this.copyPhone = JSON.parse(JSON.stringify(this.user.usr_tel_1));
            } else {
                this.copyPhone = '';
            }
            if (this.user.usr_fax_1) {
                this.copyFax = JSON.parse(JSON.stringify(this.user.usr_fax_1));
            } else {
                this.copyFax = '';
            }
            if (this.user.userExt && this.user.userExt.urx_extra_41) {
                this.copyQQ = JSON.parse(JSON.stringify(this.user.userExt.urx_extra_41));
            } else {
                this.copyQQ = '';
            }
            if (this.user.userExt && this.user.userExt.urx_extra_42) {
                this.copyWechat = JSON.parse(JSON.stringify(this.user.userExt.urx_extra_42));
            } else {
                this.copyWechat = '';
            }
            if (this.user.usr_job_title) {
                this.copyPosition = JSON.parse(JSON.stringify(this.user.usr_job_title));
            } else {
                this.copyPosition = '';
            }
            if (this.user && this.user.urxExtra44) {
                this.copySelfDescription = JSON.parse(JSON.stringify(this.user.urxExtra44));
            } else {
                this.copySelfDescription = '';
            }
            if (this.user && this.user.urxExtra45) {
                this.copyInterest = JSON.parse(JSON.stringify(this.user.urxExtra45));
            } else {
                this.copyInterest = '';
            }
            switch (chooseType) {
            case 'editTitleName':
                this.editTitleNameBox = true; //头衔
                this.editFullNameBox = false; //全名
                this.editNickNameBox = false; //昵称
                this.editEmailBox = false; //电子邮件
                this.editPhoneBox = false; //电话
                this.editFaxBox = false; //传真
                this.editQQBox = false; //QQ
                this.editWechatBox = false; //微信
                this.editPositionBox = false; //职称
                this.editSelfDescriptionBox = false; //个人描述
                this.editInterestBox = false; //兴趣
                break;
            case 'editFullName':
                this.editTitleNameBox = false; //头衔
                this.editFullNameBox = true; //全名
                this.editNickNameBox = false; //昵称
                this.editEmailBox = false; //电子邮件
                this.editPhoneBox = false; //电话
                this.editFaxBox = false; //传真
                this.editQQBox = false; //QQ
                this.editWechatBox = false; //微信
                this.editPositionBox = false; //职称
                this.editSelfDescriptionBox = false; //个人描述
                this.editInterestBox = false; //兴趣
                break;
            case 'editNickName':
                this.editTitleNameBox = false; //头衔
                this.editNickNameBox = true; //昵称
                this.editFullNameBox = false; //全名
                this.editEmailBox = false; //电子邮件
                this.editPhoneBox = false; //电话
                this.editFaxBox = false; //传真
                this.editQQBox = false; //QQ
                this.editWechatBox = false; //微信
                this.editPositionBox = false; //职称
                this.editSelfDescriptionBox = false; //个人描述
                this.editInterestBox = false; //兴趣
                break;
            case 'editEmail':
                this.editTitleNameBox = false; //头衔
                this.editEmailBox = true; //电子邮件
                this.editFullNameBox = false; //全名
                this.editNickNameBox = false; //昵称
                this.editPhoneBox = false; //电话
                this.editFaxBox = false; //传真
                this.editQQBox = false; //QQ
                this.editWechatBox = false; //微信
                this.editPositionBox = false; //职称
                this.editSelfDescriptionBox = false; //个人描述
                this.editInterestBox = false; //兴趣
                break;
            case 'editPhone':
                this.editTitleNameBox = false; //头衔
                this.editPhoneBox = true; //电话
                this.editFullNameBox = false; //全名
                this.editNickNameBox = false; //昵称
                this.editEmailBox = false; //电子邮件
                this.editFaxBox = false; //传真
                this.editQQBox = false; //QQ
                this.editWechatBox = false; //微信
                this.editPositionBox = false; //职称
                this.editSelfDescriptionBox = false; //个人描述
                this.editInterestBox = false; //兴趣
                break;
            case 'editFax':
                this.editTitleNameBox = false; //头衔
                this.editFaxBox = true; //传真
                this.editFullNameBox = false; //全名
                this.editNickNameBox = false; //昵称
                this.editEmailBox = false; //电子邮件
                this.editPhoneBox = false; //电话
                this.editQQBox = false; //QQ
                this.editWechatBox = false; //微信
                this.editPositionBox = false; //职称
                this.editSelfDescriptionBox = false; //个人描述
                this.editInterestBox = false; //兴趣
                break;
            case 'editQQ':
                this.editTitleNameBox = false; //头衔
                this.editQQBox = true; //QQ
                this.editFullNameBox = false; //全名
                this.editNickNameBox = false; //昵称
                this.editEmailBox = false; //电子邮件
                this.editPhoneBox = false; //电话
                this.editFaxBox = false; //传真
                this.editWechatBox = false; //微信
                this.editPositionBox = false; //职称
                this.editSelfDescriptionBox = false; //个人描述
                this.editInterestBox = false; //兴趣
                break;
            case 'editWechat':
                this.editTitleNameBox = false; //头衔
                this.editWechatBox = true; //微信
                this.editFullNameBox = false; //全名
                this.editNickNameBox = false; //昵称
                this.editEmailBox = false; //电子邮件
                this.editPhoneBox = false; //电话
                this.editFaxBox = false; //传真
                this.editQQBox = false; //QQ
                this.editPositionBox = false; //职称
                this.editSelfDescriptionBox = false; //个人描述
                this.editInterestBox = false; //兴趣
                break;
            case 'editPosition':
                this.editTitleNameBox = false; //头衔
                this.editPositionBox = true; //职称
                this.editFullNameBox = false; //全名
                this.editNickNameBox = false; //昵称
                this.editEmailBox = false; //电子邮件
                this.editPhoneBox = false; //电话
                this.editFaxBox = false; //传真
                this.editQQBox = false; //QQ
                this.editWechatBox = false; //微信
                this.editSelfDescriptionBox = false; //个人描述
                this.editInterestBox = false; //兴趣
                break;
            case 'editSelfDescription':
                this.editTitleNameBox = false; //头衔
                this.editSelfDescriptionBox = true; //个人描述
                this.editFullNameBox = false; //全名
                this.editNickNameBox = false; //昵称
                this.editEmailBox = false; //电子邮件
                this.editPhoneBox = false; //电话
                this.editFaxBox = false; //传真
                this.editQQBox = false; //QQ
                this.editWechatBox = false; //微信
                this.editPositionBox = false; //职称
                this.editInterestBox = false; //兴趣
                break;
            case 'editInterest':
                this.editTitleNameBox = false; //头衔
                this.editInterestBox = true; //兴趣
                this.editFullNameBox = false; //全名
                this.editNickNameBox = false; //昵称
                this.editEmailBox = false; //电子邮件
                this.editPhoneBox = false; //电话
                this.editFaxBox = false; //传真
                this.editQQBox = false; //QQ
                this.editWechatBox = false; //微信
                this.editPositionBox = false; //职称
                this.editSelfDescriptionBox = false; //个人描述
                break;
            }
        },
        /*关闭编辑弹出层*/
        closeEditPopup() {
            if (this.editTitleNameBox) {
                this.editPopup = false;
                return;
            }
            if (this.copyFullName !== this.user.usrDisplayBil || this.copyNickName !== this.user.usrNickname || this.copyEmail !== this.user.usrEmail || this.copyPhone !== this.user.usr_tel_1 || this.copyFax !== this.user.usr_fax_1 || this.copyQQ !== this.user.userExt.urx_extra_41 || this.copyWechat !== this.user.userExt.urx_extra_42 || this.copyPosition !== this.user.usr_job_title || this.copySelfDescription !== this.user.urxExtra44 || this.copyInterest !== this.user.urxExtra45) {
                this.leaveHint = true;
            } else {
                this.editPopup = false;
            }
        },
        /*弹出询问框*/
        confirmLeave() {
            setTimeout(() => {
                this.editPopup = false;
                this.leaveHint = false;
                this.user = {};
                this.getUserInfo();
            }, 1000);
        },
        cancel() {
            this.savingShowBox = false;
            this.editPopup = true;
        },
        /*保存文本*/
        saveText() {
            // debugger;
            this.$axios({
                method: 'POST',
                url: `/app/api/trainee/my/user`,
                data: {
                    interest: this.user.urxExtra45,
                    profile: this.user.urxExtra44
                }
            });
            // this.savaUrl();
            this.savingShowBox = true;
            setTimeout(() => {
                this.savingShowBox = false;
            }, 3000);
            setTimeout(() => {
                this.editPopup = false;
                this.user = {};
                this.getUserInfo();
            }, 4000);
        },
        selectSex(val) {
            this.user.usr_gender = val;
            this.gender = false;
            this.saveText();
        }
    },
    mounted() {
        this.getUserInfo();
        this.encId = this.$route.params.encId; //用户id
        this.loginUserIdwb = this.wbEncryptor(window.localStorage.getItem('loginUser')); //用户登录id
        this.loginUserId = window.localStorage.getItem('loginUser');
        if (this.encId === this.loginUserIdwb || this.encId === this.loginUserId) {
            this.isMeInd = true;
        }
    },
    created() {
        this.$Validator.extend('tipsFullName', {
            validate(value) {
                let num = 0;
                for (let i = 0; i < value.length; i++) {
                    if (value.charCodeAt(i) > 127 || value.charCodeAt(i) === 94) {
                        num += 2;
                    } else {
                        num += 1;
                    }
                }
                if (num > 80) {
                    return false;
                } else {
                    return true;
                }
            }
        });
        this.$Validator.extend('tipsNickName', {
            validate(value) {
                let num = 0;
                for (let i = 0; i < value.length; i++) {
                    if (value.charCodeAt(i) > 127 || value.charCodeAt(i) === 94) {
                        num += 2;
                    } else {
                        num += 1;
                    }
                }
                if (num > 80) {
                    return false;
                } else {
                    return true;
                }
            }
        });
        this.$Validator.extend('tipsEmail', {
            validate(value) {
                if (value.length > 80) {
                    return false;
                }
                let reg = /^\s*\w+(?:\.{0,1}[\w-]+)*@[a-zA-Z0-9]+(?:[-.][a-zA-Z0-9]+)*\.[a-zA-Z]+\s*$/;
                if (!reg.test(value)) {
                    return false;
                }
                return true;
            }
        });
        this.$Validator.extend('tipsPhone', { //格式错误，请输入11位数字的电话
            validate(value) {
                let reg = /^[0-9]{1,11}$/;
                if (!reg.test(value)) {
                    return false;
                }
                return true;
            }
        });
        this.$Validator.extend('tipsFax', {
            validate(value) {
                let num = 0;
                for (let i = 0; i < value.length; i++) {
                    if (value.charCodeAt(i) > 127 || value.charCodeAt(i) === 94) {
                        num += 2;
                    } else {
                        num += 1;
                    }
                }
                if (num > 80) {
                    return false;
                } else {
                    return true;
                }
            }
        });
        this.$Validator.extend('tipsQQ', {
            validate(value) {
                let num = 0;
                for (let i = 0; i < value.length; i++) {
                    if (value.charCodeAt(i) > 127 || value.charCodeAt(i) === 94) {
                        num += 2;
                    } else {
                        num += 1;
                    }
                }
                if (num > 80) {
                    return false;
                } else {
                    return true;
                }
            }
        });
        this.$Validator.extend('tipsWechat', {
            validate(value) {
                let num = 0;
                for (let i = 0; i < value.length; i++) {
                    if (value.charCodeAt(i) > 127 || value.charCodeAt(i) === 94) {
                        num += 2;
                    } else {
                        num += 1;
                    }
                }
                if (num > 80) {
                    return false;
                } else {
                    return true;
                }
            }
        });
        this.$Validator.extend('tipsPosition', {
            validate(value) {
                let num = 0;
                for (let i = 0; i < value.length; i++) {
                    if (value.charCodeAt(i) > 127 || value.charCodeAt(i) === 94) {
                        num += 2;
                    } else {
                        num += 1;
                    }
                }
                if (num > 80) {
                    return false;
                } else {
                    return true;
                }
            }
        });
        this.$Validator.extend('tipsSelfDescription', {
            validate(value) {
                let num = 0;
                for (let i = 0; i < value.length; i++) {
                    if (value.charCodeAt(i) > 127 || value.charCodeAt(i) === 94) {
                        num += 2;
                    } else {
                        num += 1;
                    }
                }
                if (num > 400) {
                    return false;
                } else {
                    return true;
                }
            }
        });
        this.$Validator.extend('tipsInterest', {
            validate(value) {
                let num = 0;
                for (let i = 0; i < value.length; i++) {
                    if (value.charCodeAt(i) > 127 || value.charCodeAt(i) === 94) {
                        num += 2;
                    } else {
                        num += 1;
                    }
                }
                if (num > 400) {
                    return false;
                } else {
                    return true;
                }
            }
        });
    }
};
</script>

<style scoped lang="less">
    .user-pic-4 img {
        width: 30px;
        height: 30px;
        border-radius: 50%;
    }
    .module-list-12 {
        li {
            padding: 24px 15px;
            font-size: 14px;
            background: #ffffff;
            border-bottom: 1px solid #e6e6e6;
            .arrow-right {
                margin-top: 4px;
                margin-right: -10px;
            }
            .list-left {
                width: 40%;
            }
            .list-right {
                float: right;
                width: 50%;
                color: #cccccc;
                text-align: right;
                line-height: 18px;
            }
        }
    }
    .module-list-12 li:nth-last-child(1) {
        border-bottom: none;
    }
    .paddingR2 {
        padding-right: 10px;
    }
    .word-box-03 {
        float: left;
        max-width: 80px;
        padding: 10px;
        background: #f5f5f5;
        border-radius: 2px;
        margin: 15px 10px 0 0;
        font-size: 12px;
        line-height: 15px;
    }
</style>
